import React from 'react';
import { Link } from 'react-router-dom';
import PropTypes from 'prop-types';
import './index.scss';


class SearchItem extends React.Component {
  constructor(props) {
    super(props);
    this.state = {

    }
  }
  // 过滤接受的参数
  filter(data) {
    return {
      title: data.title.rendered,
      excerpt: data.excerpt.rendered.replace(/(<a.*?\/a>)/g, ''),
      date: data.date.substr(0, 10),
      author: data.author,
      id: data.id,

    }
  }
  render() {
    const data = this.filter(this.props.data);
    const number = this.props.number < 10 ? `0${this.props.number}` : this.props.number;
    return (
      <li className="search-list-item">
        <div className="item-info">
          <h3 className="list-item-title">
            <span className="number">{number}、</span> <Link to={`/article-detail/${data.id}`}>{data.title}</Link><span className="list-item-time">{data.date}</span>
          </h3>
          <div className="list-item-excerpt" dangerouslySetInnerHTML={{ __html: data.excerpt }} />
        </div>
      </li>
    )
  }
}
export default SearchItem;
SearchItem.propTypes = {
  data: PropTypes.objectOf(Object),
  number: PropTypes.number,
}
